<section class="content-header">
    <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
        <li><a href="#">文章管理</a></li>
        <li class="active">文章列表</li>
    </ol>
</section>
<!-- Main content -->
<section class="content">
    <div class="jax-box">
        <form id="formSearch" class="form-horizontal form-search">
            <div class="form-group">
                <div class="col-md-4 col-sm-6">
                    <label class="control-label  col-xs-4" for="keywords">标题:</label>
                    <div class="col-xs-8">
                        <input type="text" class="form-control" id="keywords">
                    </div>
                </div>
                <div class="col-md-4 col-sm-6">
                    <label class="control-label  col-xs-4" for="aiticle">分类:</label>
                    <div class="col-xs-8">
                        <select class="form-control"id="categoryId">
                            <option  value="">请选择</option>
                            <option th:each="category:${categories}" th:value="${category.id}" th:text="${category.name}"></option>
                        </select>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6">
                    <label class="control-label  col-xs-4">状态:</label>
                    <div class="col-xs-8">
                        <select id="status" class="form-control">
                            <option value="">请选择</option>
                            <option value="1">已发布</option>
                            <option value="0">草稿</option>
                        </select>
                    </div>
                </div>
                <shiro:hasPermission name="article:list">
                    <div class="col-md-1 col-sm-6 " style="text-align:left;">
                        <button type="button" id="btn_query" class="btn btn-info">查询</button>
                    </div>
                </shiro:hasPermission>
            </div>
        </form>
    </div>
    <div class="jax-box jax-box-table">
        <div id="toolbar" class="btn-group">
            <shiro:hasPermission name="article:add">
            <button id="btn_add" type="button" class="btn btn-primary">
                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>写文章
            </button>
            </shiro:hasPermission>
            <shiro:hasPermission name="article:batchDelete">
            <button id="btn_batch_delete" type="button" class="btn btn-danger">
                <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>批量删除
            </button>
            </shiro:hasPermission>
            <shiro:hasPermission name="article:batchPush">
                <button id="btn_batch_push" type="button" class="btn btn-info">
                    <span class="fa fa-send-o" aria-hidden="true"></span>批量推送
                </button>
            </shiro:hasPermission>
        </div>
        <table id="table"></table>
    </div>
</section>

<script>
    var editFlag = "[[${@perms.hasPerm('article:edit')}]]";
    var deleteFlag = "[[${@perms.hasPerm('article:delete')}]]";
    var columns = [
        {checkbox: true },
        {
            field: 'title',
            title: '标题',
            align : "center"
        },{
            field: 'bizCategory',
            title: '分类',
            align : "center",
            formatter: function (value) {
                return value.name;
            }
        }, {
            field: 'tags',
            title: '标签',
            class: 'table-tags',
            align : "center",
            formatter: function (tags) {
                var tagHtml = '';
                if (tags) {
                    for (var i = 0, len = tags.length; i < len; i++) {
                        var tag = tags[i];
                        tagHtml += '<a class="btn btn-default btn-xs"> ' + tag.name + '</a> ';
                    }
                }
                return tagHtml;
            }
        },{
            field: 'slider',
            title: '轮播',
            align : "center",

            formatter : function(value) {
                if(value){
                    return '是'
                }else{
                    return '否'
                }
            }
        },{
            field: 'top',
            title: '置顶',
            align : "center",
            formatter : function(value) {
                if(value){
                    return '是'
                }else{
                    return '否'
                }
            }
        },{
            field: 'recommended',
            title: '推荐',
            align : "center",
            formatter : function(value) {
                if(value){
                    return '是'
                }else{
                    return '否'
                }
            }
        },{
            field: 'status',
            title: '状态',
            align : "center",
            formatter : function(value) {
               if(value){
                   return '已发布'
               }else{
                   return '草稿'
               }
            }
        },{
            field: 'lookCount',
            title: '浏览',
            align : "center",
        },{
            field: 'commentCount',
            title: '评论',
            align : "center",
        },{
            field: 'loveCount',
            title: '喜欢',
            align : "center",
        },
        {
            field : 'operation',
            title : '操作',
            align : "center",
            class:'min-width-100',
            formatter : function(value,
                                 row, index) {
                var edit = editFlag=="true" ? '<a class="table-btn table-btn-info" onclick="editArticle('+row.id+')">编辑</a>' : '';
                var del = deleteFlag=="true" ? '<a  class="table-btn table-btn-danger" onclick="deleteArticle('+row.id+')">删除</a>' : '';
                return edit + del;
            }
        }];
    var options={
        id:"#table",
        url: '/article/list',
        columns:columns,
        toolbar: '#toolbar',
        showRefresh: true,
        queryParams : queryParams
    }
    Core.initTable(options);

    /*查询参数*/
    function queryParams(params) {
        var temp = { //这里的键的名字和控制器的变量名必须一致，这边改动，控制器也需要改成一样的
            limit : params.limit, //页面大小
            offset : params.offset, //页码
            keywords : $("#keywords").val(),
            categoryId : $("#categoryId").val(),
            status : $("#status").val(),
        };
        return temp;
    }

    /*编辑*/
    function editArticle(id) {
        window.location.href="#article/edit?id="+id
    }
    /*删除*/
    function deleteArticle(id) {
        Core.confirm("确定删除该分类？",function () {
            Core.postAjax("/article/delete",{"id":id},function (data) {
                if(data.status==200){
                    Core.refreshTable("#table");
                }
                layer.msg(data.msg);
            })
        })
    }
    $(function () {
        /*查询*/
        $("#btn_query").click(function(){
            Core.refreshTable("#table");
        });
        /*新增*/
        $("#btn_add").click(function(){
            window.location.href="#article/add"
        });
        /*批量删除*/
        $("#btn_batch_delete").click(function(){
            var checkedRows= Core.selectMutiData("#table");
            if(checkedRows){
                Core.confirm("确定删除选中的"+checkedRows.length+"条记录？",function () {
                    var ids=[];
                    $.each(checkedRows, function (i, item) {
                        ids.push(item.id);
                    })
                    Core.postAjax("/article/batch/delete", {"ids": ids}, function (data) {
                        if (data.status == 200) {
                            Core.refreshTable("#table");
                        }
                        layer.msg(data.msg);
                    })
                })
            }
        });
        /*批量推送*/
        $("#btn_batch_push").click(function(){
            var checkedRows= Core.selectMutiData("#table");
            if(checkedRows){
                Core.confirm("确定推送选中的"+checkedRows.length+"条记录？",function () {
                    var baseUrl = window.location.protocol+"//"+window.location.host+"/blog/article/";
                    var urls=[];
                    $.each(checkedRows, function (i, item) {
                        urls.push(baseUrl+item.id);
                    })
                    Core.postAjax("/article/batch/push", {"urls": urls}, function (data) {
                        if (data.status == 200) {
                            layer.msg(data.msg);
                        }else{
                            if(null!==data.data){
                                var msg="推送成功"+data.data.success+"条;";
                                var notSameSiteLength = data.data.notSameSite==null?0:data.data.notSameSite.length;
                                var notValidLength = data.data.notValid==null?0:data.data.notValid.length;
                                msg+= ("推送失败"+(notSameSiteLength+notValidLength)+"条");
                                layer.msg(msg);
                            }else{
                                layer.msg(data.msg);
                            }
                        }

                    })
                })
            }
        });

    });

</script>